<template>
	<view>
		<u-popup :show="show" mode="bottom" :closeable="true" @close="cancel">
        <view :style="{ backgroundColor: bgColor }" class="inventory" >
          <view class="inventory-t">{{ title }}</view>
          <slot></slot>
        </view>
      </u-popup>
	</view>
</template>

<script>
	export default {
		name:"Popup",
		props: {
			title: {
				type: String,
				default: ''
			},
			show: {
				type: Boolean,
				default: false
			},
      bgColor: {
        type: String,
				default: '#f5f5f5'
      }
		},
		methods: {
			cancel() {
				this.$emit('cancel')
			}
		}
	}
</script>

<style lang="scss" >
.inventory {
  background-color: #f5f5f5;
  border-radius: 32rpx 32rpx 0px 0px;
  &-t {
    margin: 40rpx 0 48rpx;
    text-align: center;
    font-size: 36rpx;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #1A1A1A;
    line-height: 50rpx;
  }
}
::v-deep .u-popup__content {
	background-color: transparent !important;
}
::v-deep .u-popup__content__close--top-right{
	top: 48rpx !important;
	
}
::v-deep .uicon-close{
	color: #1A1A1A !important;
}
</style>
